/*
 * @Description: 头部选择
 * @Author: Zzt
 * @Date: 2022-11-23 15:03:57
 * @LastEditTime: 2022-12-07 16:29:45
 */
import { fetchATListByFondId } from '@/api/archivesType';
import { fetchFondsListByUnitId } from '@/api/fonds';
import { fetchDicItemListByPage } from '@/api/rulesettings/dictionary';
import { IFond } from '@/interfaces/fond';
import { appState } from '@/store/mobx';
import { Select } from 'antd';
import { observer } from 'mobx-react-lite';
import { memo, useEffect, useState } from 'react';
import { useFamilyStatisticsContext } from '../contexts/FamilyStatisticsContext';

const { Option } = Select;

const HeadWarp = () => {
  const { setATList, setPeriodList, setStorageList } = useFamilyStatisticsContext();
  // 全宗列表
  const [fondsList, setFondsList] = useState([]);
  // 选中的全宗
  const [selectFondId, setSelectFondId] = useState(0);

  // 档案类型列表
  // const [ATList, setATList] = useState([]);
  // 加载时获取全宗列表，获取成功后默认选中第一条并把第一条返回出去
  useEffect(() => {
    const selectUnit = appState.unitId;
    if (selectUnit) {
      fetchFondsListByUnitId(selectUnit).then((res) => {
        const _fondList: IFond[] = res.data;
        setFondsList(_fondList);
        setSelectFondId(_fondList[0].id);
      });
    }
  }, [appState.unitId]);

  useEffect(() => {
    if (selectFondId) {
      fetchATListByFondId(selectFondId).then((res) => {
        const { data } = res;
        setATList(
          data.map((item: any) => {
            return { label: item.atName, value: item.id };
          })
        );
      });
    }
  }, [selectFondId]);
  useEffect(() => {
    /* 存储年限 */
    fetchDicItemListByPage({
      pageNo: 1,
      pageSize: 10,
      param: { typeId: 1 }
    }).then((res) => {
      const { data } = res;
      setPeriodList(
        data.results.map((item: any) => {
          return { label: item.name, value: item.code };
        })
      );
    });
    /* 存储格式 */
    fetchDicItemListByPage({
      pageNo: 1,
      pageSize: 10,
      param: { typeId: 8 }
    }).then((res) => {
      const { data } = res;
      setStorageList(
        data.results.map((item: any) => {
          return { label: item.name, value: item.code };
        })
      );
    });
  }, []);
  /**
   * @description: 切换全宗
   * @param {number} val 选中的全宗
   */
  const handleFondChange = (val: number) => {
    setSelectFondId(val);
  };
  return (
    <>
      全宗-
      <Select value={selectFondId} onChange={handleFondChange} size="large">
        {fondsList.map((fond) => (
          <Option key={fond.id} value={fond.id}>
            {fond.fondName}
          </Option>
        ))}
      </Select>
    </>
  );
};
export default memo(observer(HeadWarp));
